<template>
    <div class="box">
        地址：
        <el-input v-model="address" placeholder="请输入内容"></el-input>车位号:
        <el-input v-model="number" placeholder="请输入内容"></el-input>产权：
        <el-input v-model="property" placeholder="请输入内容"></el-input>时间：
        <el-input v-model="cycle" placeholder="请输入内容"></el-input>价格：
        <el-input v-model="price" placeholder="请输入内容"></el-input>
        <el-button type="success" plain @click="sureupdata">确认修改</el-button>
        <el-button type="info" plain @click="reset">重置按钮</el-button>
    </div>
</template>

<script>
import { createNamespacedHelpers } from "vuex";
const { mapState, mapActions, mapMutations } = createNamespacedHelpers(
    "admins"
);
export default {
    async mounted() {
        //将要修改的数据渲染到对应的地方
        var parkings = await this.getParkings();
        var newpagerows = parkings.pagerows;
        var newlessors = newpagerows.filter(elem => {
            return elem._id == this.id;
        });
        this.address = newlessors[0].address;
        this.number = newlessors[0].number;
        this.property = newlessors[0].property;
        this.price = newlessors[0].price;
        this.cycle = newlessors[0].cycle;
    },
    props: ["id"],
    data() {
        return {
            address: "",
            number: "",
            property: "",
            cycle: "",
            price: ""
        };
    },
    methods: {
        ...mapActions(["EditParkings", "getParkings"]),
        //重置按钮
        reset() {
            (this.address = ""),
                (this.number = ""),
                (this.property = ""),
                (this.prcie = ""),
                (this.cycle = "");
        },
        sureupdata() {
            this.EditParkings({
                _id: this.id,
                address: this.address,
                number: this.number,
                property: this.property,
                price:this.price,
                cycle:this.cycle
            });
        }
    }
};
</script>

<style scoped>
.box {
    width: 40%;
    margin: 0 auto;
    margin-top: 30px;
}
.el-input {
    margin-bottom: 20px;
}
</style>